<!DOCTYPE html>
<html lang="en">

<head>
    <#include "/lx/admin/components/meta.html" />
    <title>课程详情 ${metaTitleSuffix!}</title>
    <#include "/lx/admin/components/stylesheets.html" />
</head>

<body>
    <div id="app">
        <el-container>
            <#assign menuIndex="3-1" />
            <#include "/lx/admin/components/menu.html" />
            <el-container>
                <#include "/lx/admin/components/header.html" />
                <el-main>
                    <template>
                        <el-form ref="form" :model="info" label-width="100px">
                            <el-form-item label="课程名称">
                                <el-input v-model="info.name" placeholder="请输入课程名称"></el-input>
                            </el-form-item>
                            <el-form-item label="英文名称">
                                <el-input v-model="info.englishName" placeholder="请输入英文名称"></el-input>
                            </el-form-item>
                            <el-form-item label="所属大学">
                                <el-select v-model="info.schoolId" clearable placeholder="所属大学" disabled>
                                    <el-option v-for="(item, index) in schools" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="课程级别">
                                <el-select v-model="info.rank" clearable placeholder="课程级别">
                                    <el-option label="本科预科" :value="3"></el-option>
                                    <el-option label="本科" :value="0"></el-option>
                                    <el-option label="硕士" :value="1"></el-option>
                                    <el-option label="博士" :value="2"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="学院">
                                <el-input v-model="info.department" placeholder="请输入学院"></el-input>
                            </el-form-item>
                            <el-form-item label="系别">
                                <el-input v-model="info.category" placeholder="请输入系别"></el-input>
                            </el-form-item>
                            <el-form-item label="时长">
                                <el-input v-model="info.term" placeholder="请输入时长"></el-input>
                            </el-form-item>
                            <el-form-item label="学费">
                                <el-input v-model="info.fee" placeholder="请输入学费"></el-input>
                            </el-form-item>
                            <el-form-item label="核心课程">
                                <el-input v-model="info.coreClass" type="textarea" :autosize="{ minRows: 5 }" placeholder="请输入核心课程"></el-input>
                            </el-form-item>
                            <el-form-item label="录取标准">
                                <el-input v-model="info.requirement" type="textarea" :autosize="{ minRows: 5 }" placeholder="请输入录取标准"></el-input>
                            </el-form-item>
                            <el-form-item label="职业发展">
                                <el-input v-model="info.development" type="textarea" :autosize="{ minRows: 5 }" placeholder="请输入职业发展"></el-input>
                            </el-form-item>
                            <el-form-item label="关键词">
                                <el-input v-model="info.keywords" placeholder="请输入关键词，以半角分号隔开"></el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="submit">提交</el-button>
                            </el-form-item>
                        </el-form>
                    </template>
                </el-main>
            </el-container>
        </el-container>
        <#include "/lx/admin/components/footer.html" />
    </div>
    <#include "/lx/admin/components/scripts.html" />
    <script type="text/javascript">
    var vue = new Vue({
        el: '#app',
        data() {
            return {
                info: {},
                schools: []
            }
        },
        watch: {
        },
        mounted: function() {
            this.info = ${info!'{}'}
            this.schools = ${schools!'[]'}
            if (!this.info.schoolId) {
                this.info.schoolId = Number('${schoolId!}');
            }
            if (this.info.coreClass) {
                this.info.coreClass = this.info.coreClass.replace(/<br \/>/g, '\n');
            }
            if (this.info.requirement) {
                this.info.requirement = this.info.requirement.replace(/<br \/>/g, '\n');
            }
            if (this.info.development) {
                this.info.development = this.info.development.replace(/<br \/>/g, '\n');
            }
        },
        methods: {
            submit() {
                var self = this;
                if (!self.info.schoolId) {
                    msg("请选择所属大学");
                    return;
                }
                if (!self.info.name) {
                    msg("请输入课程名称");
                    return;
                }
                if (!self.info.englishName) {
                    msg("请输入英文名称");
                    return;
                }

                var url = "/lx/admin/school/submitMajor"
                var param = {
                    majorId: self.info.id,
                    schoolId: self.info.schoolId,
                    name: self.info.name,
                    englishName: self.info.englishName,
                    rank: self.info.rank,
                    department: self.info.department,
                    category: self.info.category,
                    term: self.info.term,
                    fee: self.info.fee,
                    coreClass: self.info.coreClass ? self.info.coreClass.replace(/\n/g, '<br />') : '',
                    requirement: self.info.requirement ? self.info.requirement.replace(/\n/g, '<br />') : '',
                    development: self.info.development ? self.info.development.replace(/\n/g, '<br />') : '',
                    keywords: self.info.keywords
                };
                var success = () => {
                    if ('${referer!}' != '') {
                        window.location.href = '${referer!}';
                    } else {
                        window.location.href = "/lx/admin/school/list";
                    }
                }
                var fail = () => {
                    msg(response.data.msg);
                }
                var complete = () => {}
                axiosRequestPro(url, param, success, fail, complete);
            }
        }
    })
    </script>
    <style type="text/css">
    .title {
        font-size: 18px;
        font-weight: bold;
    }

    .label {
        width: 100%;
        text-align: right;
        float: left;
        font-size: 14px;
        color: #606266;
        line-height: 40px;
        padding: 0 12px 0 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    input[type="file"] {
        display: none !important;
    }

    .image-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .image-uploader .el-upload:hover {
        border-color: #409EFF;
    }

    .image-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }

    .image {
        width: 178px;
        height: 178px;
        display: block;
    }
    </style>
    <#include "/lx/admin/components/msg.html" />
</body>

</html>